<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:t="http://myfaces.apache.org/tomahawk"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:body>
    	<ui:composition template="./templates/framework.xhtml">
			<ui:define name="content">
			<div id="multiPartContainer">
					<div class="multiPart" id="partSignupForm">
						<ui:include src="./templates/header.xhtml">
							<ui:param name="text" value="#{i18n['signup.head']}" />
						</ui:include>
						<h:form id="signupForm" styleClass="primary">
							<div>
								<h:outputLabel for="name" value="#{i18n['generic.name']}" />
								<h:inputText id="name" value="#{signupBean.name}" required="true" requiredMessage="#{i18n['generic.valueRequired']}" />
								<span class="error"><h:message for="name" /></span>
							</div>
							<div>
								<h:outputLabel for="email" value="#{i18n['generic.email']}" />
								<h:inputText id="email" value="#{signupBean.email}" required="true" requiredMessage="#{i18n['generic.valueRequired']}">
									<f:validator validatorId="validateEmail" />
									<f:validator binding="#{usernameValidator}" />
								</h:inputText>
								<span class="error"><h:message for="email" /></span>
							</div>
							<div>
								<h:outputLabel for="password" value="#{i18n['generic.password']}" />
								<h:inputSecret id="password" value="#{signupBean.password}" required="true" requiredMessage="#{i18n['generic.valueRequired']}" autocomplete="off" redisplay="true" styleClass="switchVisibility" />
								<span class="error"><h:message for="password" /></span>
							</div>
							<div>
								<h:outputLabel value="Strength" for="passwordStrength" />
								<h:outputText id="passwordStrength" value="Unknown" styleClass="outputText" />
							</div>
							<div>
								<h:selectBooleanCheckbox id="termsAccepted" value="#{signupBean.termsAccepted}" validator="#{genericValidationBean.validateTermsAcceptedChecked}" />
								<h:outputLabel for="termsAccepted" styleClass="checkboxLabel"><h:outputText value="#{i18n['completeProfile.termsAccepted']}" escape="false" /></h:outputLabel>
								<span class="error"><h:message for="termsAccepted" /></span>
							</div>
							<div>
								<h:selectBooleanCheckbox id="passwordChecked" value="#{signupBean.passwordChecked}" validator="#{genericValidationBean.validatePasswordChecked}" />
								<h:outputLabel for="passwordChecked" styleClass="checkboxLabel"><h:outputText value="#{i18n['generic.passwordChecked']}" /></h:outputLabel>
								<span class="error"><h:message for="passwordChecked" /></span>
							</div>
							<div class="hint">
								<h:outputText value="#{i18n['generic.passwordToggleHint']}" />
							</div>
							<div class="buttons">
								<h:commandButton type="submit" value="#{i18n['signup.create']}" action="#{signupBean.signup}" />
								<input type="button" value="#{i18n['generic.cancel']}" onclick="location.href='login.xhtml'" />
							</div>
						</h:form>
					</div>
					<div class="multiPart" id="partTermsOfUse">
						<ui:include src="./templates/header.xhtml">
							<ui:param name="text" value="#{i18n['generic.back']}" />
							<ui:param name="scroll" value="partSignupForm" />
						</ui:include>
						<h:outputText value="#{i18n['completeProfile.terms']}" escape="false" />
					</div>
				</div>
			</ui:define>
		</ui:composition>
    </h:body>
</html>